/* 用户组管理 */
import React, { PureComponent } from 'react';
import { Table, Pagination, Form, Input, Button } from 'antd';
class Index extends PureComponent {
  render() {
    const columns = [
      {
        title: '用户组名称',
        dataIndex: 'name',
        key: 'name',
      },
      {
        title: '设置用户组成员',
        dataIndex: 'key',
        key: 'key',
        render: (key) => {
          return <a>设置用户组成员</a>;
        },
      },
      {
        title: '编辑人员',
        dataIndex: 'person',
        key: 'person',
      },
      {
        title: '编辑时间',
        dataIndex: 'time',
        key: 'time',
      },
      {
        title: '操作',
        dataIndex: 'key',
        key: 'key',
        render: (key) => {
          return (
            <div>
              <a style={{ marginRight: 10 }}>编辑</a>
              <a>删除</a>
            </div>
          );
        },
      },
    ];
    const dataSource = [
      {
        key: '1',
        person: '胡大大',
        name: '宋立霞宋立霞3',
        time: '2020-12-21',
      },
    ];

    return (
      <div>
          <div style={{overflow:'hidden'}}>
        <Form layout="inline" style={{ marginBottom: 20 ,float:'right'}}>
          <Form.Item>
            <Input placeholder="搜索用户组名称" />
          </Form.Item>
          <Form.Item>
            <Button type="primary">查询</Button>
          </Form.Item>
          <Form.Item>
            <Button type="primary" danger>
              增加
            </Button>
          </Form.Item>
        </Form>
        </div>
        <Table columns={columns} pagination={false} dataSource={dataSource}></Table>
        <Pagination
          showQuickJumper
          showSizeChanger={false}
          locale="zh-CN"
          total={1}
          style={{ float: 'right', marginTop: 25 }}
          showTotal={(total, range) => `第${range[0]}条-第${range[1]}条，共 ${total} 条`}
        />
      </div>
    );
  }
}

export default Index;
